import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:gongge/utils/AudioUtils.dart';
import '../utils/TimeUtils.dart';

import '../bean/BadgeBean.dart';
import '../sqflite/DBManager.dart';

class Travel2 extends StatefulWidget {
  const Travel2({Key? key}) : super(key: key);

  @override
  State<Travel2> createState() => Travel2State();
}

class Travel2State extends State<Travel2> with SingleTickerProviderStateMixin {
  List<BadgeBean> lists = [];
  AnimationController? controller;
  @override
  void initState() {
    //滑动就重新执行
    controller = AnimationController(
        duration: Duration(milliseconds: 800), vsync: this //垂直同步
        );
    // controller?.repeat(reverse: false); //循环  从小变大，再从大到小

//动画开始、结束、向前移动或向后移动时会调用StatusListener
    controller?.addStatusListener((status) {
      if (status == AnimationStatus.completed) {
        controller?.stop();
      }
    });
    controller?.forward();

    DBManager().getDBBadge().then((value) {
      if (value.isNotEmpty) {
        lists = value;
        setState(() {});
      }
    });

    // for (int i = 0; i < 20; i++) {
    //   var badgeBean = BadgeBean();
    //   badgeBean.time = DateTime.now().millisecondsSinceEpoch;
    //   badgeBean.img = badgeList[i];
    //   DBManager().insertBadge(badgeBean);
    // }

    super.initState();
  }

  @override
  void dispose() {
    controller?.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        image: DecorationImage(
            image: AssetImage('assets/images/tab_bg.png'), fit: BoxFit.fill),
      ),
      child: ScaleTransition(
        scale: controller!,
        child: lists.length > 0
            ? Container(
                margin: EdgeInsets.all(ScreenUtil().setHeight(30)),
                child: GridView.builder(
                    itemCount: lists.length,
                    shrinkWrap: true,
                    padding: EdgeInsets.only(top: 0),
                    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 6,
                      // mainAxisSpacing: ScreenUtil().setHeight(10), //每行间距
                      //  crossAxisSpacing: ScreenUtil().setWidth(10), //交叉轴每行间距
                    ),
                    itemBuilder: (context, index) {
                      //数字越大，图标就越小
                      return Padding(
                          padding: EdgeInsets.all(8),
                          child: GestureDetector(
                            onTap: () {
                              _showDiaog(index);
                            },
                            child: Image.asset(lists[index].img,
                                fit: BoxFit.cover),
                          ));
                    }),
              )
            : Text(""),
      ),
    );
  }

  void _showDiaog(int index) {
    //弹窗
    showGeneralDialog(
        context: context,
        pageBuilder: (context, anim1, anim2) {
          return Text("");
        },
        // barrierColor: Colors.grey.withOpacity(.4), // Dialog 的背景色
        barrierDismissible: true, //控制 Dialog 是否消失
        barrierLabel: "",
        transitionDuration: Duration(milliseconds: 200),
        transitionBuilder: (context, anim1, anim2, child) {
          return Transform.scale(
            scale: anim1.value,
            child: Dialog(
              //   Dialog自己定宽高
              insetPadding: EdgeInsets.only(
                  left: ScreenUtil().setWidth(100),
                  right: ScreenUtil().setWidth(100)),
              backgroundColor: Colors.transparent,
              child: Container(
                decoration: BoxDecoration(
                  image: DecorationImage(
                      image: AssetImage('assets/images/bg_blue.png'),
                      fit: BoxFit.fill),
                ),
                height: ScreenUtil().setHeight(200),
                // width: 100,
                child: Column(
                  children: [
                    Align(
                      alignment: Alignment.topRight,
                      child: Padding(
                        padding: EdgeInsets.all(10),
                        child: GestureDetector(
                            onTap: () {
                              Navigator.pop(context);
                            },
                            child: Image.asset("assets/images/colse_blue.png",
                                width: ScreenUtil().setWidth(30),
                                height: ScreenUtil().setHeight(30),
                                fit: BoxFit.contain)),
                      ),
                    ),
                    Align(
                      alignment: Alignment.center,
                      child: Center(
                        child: Column(
                          children: [
                            Image.asset(lists[index].img,
                                width: ScreenUtil().setWidth(50),
                                height: ScreenUtil().setHeight(50),
                                fit: BoxFit.contain),
                            SizedBox(
                              height: ScreenUtil().setHeight(19),
                            ),
                            AutoSizeText(
                              TimeUtils.gtTime6(
                                  DateTime.fromMillisecondsSinceEpoch(
                                      lists[index].time)),
                              style: TextStyle(
                                fontSize: ScreenUtil().setSp(14),
                                fontWeight: FontWeight.bold,
                                color: Color.fromRGBO(255, 255, 255, 1),
                                height: 0.7,
                              ),
                              maxLines: 1,
                              textAlign: TextAlign.center,
                              overflow: TextOverflow.ellipsis,
                            ),
                          ],
                        ),
                      ),
                    )
                  ],
                ),
              ),
            ),
          );
        });
    AudioUtils.getInstance()?.play2("get_gem_medal.mp3");
  }
}
